import { VcTable, type IColumnsOption, Clamp } from 'vc';
import { toF9, setHrefUrlTool } from '@/utils';

export enum CellRenderMap {
  /** 公司名称*/
  MyCompany = 'MyCompany',
  /** 关键词高亮*/
  HighLight = 'HighLight',
  /** 跳转附件 */
  File = 'File'
}

const renderMap = {
  [CellRenderMap.MyCompany]: {
    // 公司名称
    renderDefault(renderOpts, params) {
      const { row, column } = params;
      const { events = {} } = renderOpts;

      const content = row.highlight?.companyName ? row.highlight?.companyName : row[column.field];

      if (row.companyId) {
        return <a title={row[column.field]} class="companyName line-clamp" onClick={() => events.click(row)} v-html={content}></a>;
      } else {
        return <span title={row[column.field] || ''} v-html={content || '-'}></span>;
      }
    }
  },
  [CellRenderMap.HighLight]: {
    // 关键词高亮
    renderDefault(_renderOpts, params) {
      const { row, column } = params;

      const content = row.highlight?.[column.field] ? row.highlight?.[column.field] : row[column.field];

      if (content) {
        return <span class="line-clamp" v-html={content}></span>;
      } else {
        return '-';
      }
    }
  },
  [CellRenderMap.File]: {
    renderDefault(renderOpts, params) {
      const { row, column, content } = params;
      const { events = {} } = renderOpts;

      if (row[column.field]) {
        if (row.fileUrl) {
          return <a class="line-clamp" onClick={() => events.click.toFilePage(row)}>{content}</a>;
        } else {
          return <span v-html={content}></span>;
        }
      } else {
        return '-';
      }
    }
  }
};

VcTable.renderer.mixin(renderMap);

export const toF9Page = (data: any) => {
  toF9(data.companyId);
};

// 附件跳转
const toFilePage = (data: any) => {
  console.log(data);
};

/** 附件列 */
export const FILE: IColumnsOption = {
  field: 'fileUrl',
  headerAlign: 'center',
  cellRender: {
    name: CellRenderMap.File,
    events: { click: toFilePage }
  }
};

/** 公司列 */
export const COMPANY_NAME: IColumnsOption = {
  field: 'companyName',
  title: '公司名称',
  width: 270,
  fixed: 'left',
  headerAlign: 'center',
  cellRender: {
    name: CellRenderMap.MyCompany,
    events: { click: toF9Page }
  },
  sortBy: 'companyName'
};

/** 多选列 */
export const CHECKBOX: IColumnsOption = {
  type: 'checkbox',
  width: 50,
  fixed: 'left',
  align: 'center'
};

/** 序号列 */
export const INDEX: IColumnsOption = {
  type: 'seq',
  title: '序号',
  width: 70,
  fixed: 'left',
  align: 'center'
};

/** 披露日期 */
export const NOTICEDATE: IColumnsOption = { field: 'noticeDate', title: '披露日期', align: 'center', width: 100, sortable: true, sortBy: 'noticeDate' };

/** 所在省 */
export const PROVINCE: IColumnsOption = { field: 'province', title: '所属省', align: 'center', width: 80, sortable: true, sortBy: 'province' };

/** 所属市 */
export const CITY: IColumnsOption = { field: 'city', title: '所属市', align: 'center', width: 80, sortable: true, sortBy: 'city', showOverflow: 'title' };

/** 所在县*/
export const COUNTRY: IColumnsOption = { field: 'country', title: '所属县', align: 'center', width: 80, sortable: true, sortBy: 'country', showOverflow: 'title' };

/** 行业 */
export const INDUSTRY_CATEGORY: IColumnsOption = { field: 'industryCategory', title: '行业', minWidth: 134, headerAlign: 'center', sortable: true, sortBy: 'industryCategory', showOverflow: 'title' };

/** 成立日期 */
export const BUSINESS_DATA: IColumnsOption = { field: 'businessTermStartDate', title: '成立日期', align: 'center', sortable: true, sortBy: 'businessTermStartDate', width: 134 };

/** 注册资本 */
export const REGISTERED_CAPITAL: IColumnsOption = {
  field: 'registeredCapital',
  title: '注册资本',
  width: 160,
  align: 'center',
  sortable: true,
  sortBy: 'registeredCapital',
  formatter: ({ row }) => {
    return row.registeredCapital ? `${Number(row.registeredCapital).toFixed(2)}${row.registeredCapitalUnit}` : '-';
  }
};

/** 信息来源 */
export const INFO_SOURCE: (field: string) => IColumnsOption = (field) => {
  return {
    title: '信息来源',
    width: !field ? 100 : 300,
    align: !field ? 'center' : 'left',
    headerAlign: 'center',
    showOverflow: 'title',
    slots: {
      default: ({ row }) => {
        if (row.fileUrl) {
          return <a class="line-clamp" onClick={() => setHrefUrlTool(row.fileType, row.fileUrl, row.id ? row.id : '')} v-html={row[field] || '查看'}></a>;
        } else {
          return <span v-html={row[field] || '-'}></span>;
        }
      }
    }
  };
};

/** 年度 (field需要自行添加) */
export const TAG_YEAR: IColumnsOption = {
  field: 'tagYear',
  title: '认定年度',
  width: 100,
  align: 'center',
  sortable: true,
  formatter({ row, column }) {
    return row[column.field] ? row[column.field] + '年' : '-';
  }
};

/** 附件跳转 */
export const renderFileJump = (row, title) => {
  const { fileType = '', fileUrl = '', id = '', bizType = '' } = row;
  return title ? (
    <Clamp
      class={[id || fileUrl ? 'text-[#1382EF] cursor-pointer hover:underline' : '']}
      maxLines={2}
      autoResize
      text={title}
      onClick={id || fileUrl ? () => setHrefUrlTool(fileType, fileUrl, id, bizType) : () => {}}
    />
  ) : (
    '-'
  );
};

/**
 * @description 溯源
 * @param { Number } index 指标对应的下标
 * @param { Boolean } showJump 溯源是否可跳转
 * @param { Function } goSource 溯源跳转内部方法
 */
export const renderSource = (row: any, index: number, showJump: boolean, goSource: Function) => {
  const _value = row?.values[index]?.indicatorDisplayValue;
  const hasRemark = row.values[index]?.indicatorDisplayValue && (row.values[index]?.calcIndicatorRemark || row.values[index]?.contentDescription);

  return (
    <div>
      {showJump ? (
        <a class={[{ sourceLink: showJump }, { hasRemark: hasRemark }]}>
          <span onClick={() => goSource(row?.values[index])}>{_value ?? '-'}</span>
        </a>
      ) : (
        <span class={{ hasRemark: hasRemark }}>{_value ?? '-'}</span>
      )}
    </div>
  );
};
